<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DOM</title>
</head>
<body>
<h1>第十章 DOM</h1>
<div id="myDiv" class="bd" title="Body text" lang="en" dir="ltr" my_special_attribute="hello!">Some text</div>

<ul id="myList">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

<!-- 没有内容，也就没有文本节点 -->
<div></div>
<!-- 有空格，因而有一个文本节点 -->
<div></div>
<!-- 有内容，因而有一个文本节点 -->
<div>Hello World!</div>
<div id="commentDiv"><!--A comment --></div>
<ul id="myUl"></ul>
<table border="1" width="100%">
    <tbody>
    <tr>
        <td>Cell 1,1</td>
        <td>Cell 2,1</td>
    </tr>
    <tr>
        <td>Cell 1,2</td>
        <td>Cell 2,2</td>
    </tr>
    </tbody>
</table>
<button onclick="documentElementTest()">documentElementTest</button>
<button onclick="searchElementTest()">searchElementTest</button>
<button onclick="createElementTest()">createElementTest</button>
<button onclick="childNodesTest()">childNodesTest</button>
<button onclick="textNodeTest()">textNodeTest</button>
<button onclick="commentTest()">commentTest</button>
<button onclick="documentFragmentTest()">documentFragmentTest</button>
<button onclick="loadScriptTest()">loadScriptTest</button>
<button onclick="loadStyleTest()">loadStyleTest</button>
<button onclick="createTableTest()">createTableTest</button>
<script type="text/javascript" src="../js/ch10.js"></script>
</body>
</html>